
(function() {

	// first, define the pane class.
	// then, make it a handler for both "settings" and "template-settings"
	var settingsPane = new Class((function(){
	
		return {
			extend: Berta.Pane,
			
			defaults: {
				type: 'settings'
			},
			
			constructor: function(options) {
				Berta.Pane.call(this, options);
				this.setTitle('Settings');
			},
			
			//   .______    __    __  .______    __       __    ______    ////////////////////////////////////////////////////////////
			//   |   _  \  |  |  |  | |   _  \  |  |     |  |  /      |   ////////////////////////////////////////////////////////////
			//   |  |_)  | |  |  |  | |  |_)  | |  |     |  | |  ,----'   ////////////////////////////////////////////////////////////
			//   |   ___/  |  |  |  | |   _  <  |  |     |  | |  |        ////////////////////////////////////////////////////////////
			//   |  |      |  `--'  | |  |_)  | |  `----.|  | |  `----.   ////////////////////////////////////////////////////////////
			//   | _|       \______/  |______/  |_______||__|  \______|   ////////////////////////////////////////////////////////////
	
			
			afterOpen: /*override */ function() {
				this._(render)();
				this.fireResize();
			},
			
			beforeClose: /* override */ function() {
				
			}
			
			
		};
	
	
		//   .______   .______     __  ____    ____  ___   .___________. _______    //////////////////////////////////////////////////
		//   |   _  \  |   _  \   |  | \   \  /   / /   \  |           ||   ____|   //////////////////////////////////////////////////
		//   |  |_)  | |  |_)  |  |  |  \   \/   / /  ^  \ `---|  |----`|  |__      //////////////////////////////////////////////////
		//   |   ___/  |      /   |  |   \      / /  /_\  \    |  |     |   __|     //////////////////////////////////////////////////
		//   |  |      |  |\  \--.|  |    \    / /  _____  \   |  |     |  |____    //////////////////////////////////////////////////
		//   | _|      | _| `.___||__|     \__/ /__/     \__\  |__|     |_______|   //////////////////////////////////////////////////
	
		function render() {
			if (!this.rendered) {
				var sDef = Berta.Settings.instance().getDefinitions(this.type);
				if (sDef !== null) {
					this.empty();
					this.fill(Berta.SettingsRenderer.instance().getRenderedFromDefinitions(this.type, sDef, 'panel'));
					this.rendered = true;
				} else {
					this.fill('<h4>Error!</h4><p>Settings not yet loaded</p>');
				}

				this.fill('<h4>DEBUG</h4><p><a href="#" class="x-debug-clear-local-settings">reload settings from server</a></p>');
				this.elements.inside.find('.x-debug-clear-local-settings').click(function() {
					Berta.Settings.instance().clearLocalSettingsCache();
					return false;
				})
			}
		}
	
	
	
	
	})());
	
	//Berta.Panel.addPaneDefinition('template-settings', settingsPane);
	Berta.Panel.addPaneDefinition('settings', settingsPane);
	
	
})();
